<template>
  <div>
    <Layout :style="{padding: '0 24px 24px'}">
      <Breadcrumb :style="{margin: '24px 0'}">
        <BreadcrumbItem>知识管理</BreadcrumbItem>
        <BreadcrumbItem>
          <router-link to="/index/knowledgeBox">知识体系库</router-link>
        </BreadcrumbItem>
        <BreadcrumbItem>编辑知识</BreadcrumbItem>
      </Breadcrumb>
      <Content :style="{padding: '24px', minHeight: '280px', background: '#fff'}">
        <div>
          <Form :model="questionData" label-position="right" :label-width="100">
            <FormItem label="知识id">{{questionData.id}}</FormItem>
            <FormItem label="知识标题">
              <Input v-model="questionData.question" />
            </FormItem>
            <FormItem label="核心词">
              <Input v-model="questionData.keyword" />
            </FormItem>
            <FormItem label="答案">
              <Input v-model="questionData.answer" type="textarea" :rows="3" />
            </FormItem>
            <FormItem label="修改人">{{questionData.author}}</FormItem>
            <FormItem label="视角">
              <Input v-model="questionData.angle" />
            </FormItem>
            <div class="button">
              <router-link to="/index/knowledgeBox">
                <Button>取消</Button>
              </router-link>
              <router-link to="/index/knowledgeBox">
                <Button type="primary" @click="editKnowledge">确定</Button>
              </router-link>
            </div>
          </Form>
        </div>
      </Content>
    </Layout>
  </div>
</template>
<script>
import axios from "axios";
import { myGet, myPost } from "../utils/request.js";
import { url } from "../utils/api.js";
import { timeFormat } from "../utils/changeTime.js";

export default {
  data() {
    return {
      questionData: {},   //加载的知识对象
      editBefore  : {}    //更改之前的对象信息
    };
  },
  methods: {
    // 编辑知识确认
    editKnowledge() {
      var that = this;
      //判断问题、关键词、答案、角度是否更改
      if (
        that.questionData.question == that.editBefore.question &&
        that.questionData.keyword == that.editBefore.keyword &&
        that.questionData.answer == that.editBefore.answer &&
        that.questionData.angle == that.editBefore.angle
      ) {
        that.$Message.warning("知识信息未被更改!");
        return;
      }
      var questionData = that.questionData;
      let url          = that.Api.url.editQuestion;
      let params = {
        id: questionData.id,
        question: questionData.question,
        keyword: questionData.keyword,
        answer: questionData.answer,
        author: questionData.author,
        angle: questionData.angle,
      };
      that.http.post(url, params).then(res => {
        console.log("that.questionData", questionData);
        that.$Message.success("修改成功");
      });
    }
  },
  mounted() {
    var that = this;
    console.log(that.$route.params.id);
    let questionID = that.$route.params.id;
    let url    = that.Api.url.findIDQuestion;
    let params = {
      questionId: questionID
    };
    that.http.get(url, {
      params: params
    })
    .then(res => {
      that.questionData        = res[0];
      that.editBefore.question = res[0].question;
      that.editBefore.keyword  = res[0].keyword;
      that.editBefore.answer   = res[0].answer;
      that.editBefore.angle    = res[0].angle;
    });

  }
};
</script>

<style>
.ivu-input {
  width: 80%;
}
form {
  position: relative;
}
.button {
  width   : 150px;
  height  : 50px;
  position: relative;
  bottom  : 0;
  left    : 60%;
}
</style>
